import React, { PropTypes } from 'react';
import withStyles from 'isomorphic-style-loader/lib/withStyles';
import s from './Notification.css';
import connectComponent from '../../utils/connectComponent';
import { Alert } from 'react-bootstrap';

class Notification extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      show: false,
    };
  }

  componentWillReceiveProps(nextProps) {
    this.setState({ show: true });
  }

  startTime() {
    setTimeout(() => {
      this.setState({ show: false });
    }, 500000);
  }

  render() {
    const { message } = this.props;
    const style = 'danger';
    if (message && this.state.show) {
      this.startTime();
      return (
        <div className={s.root}>
          <Alert bsStyle={style}>
            {message}
          </Alert>
        </div>
      );
    }
    return (<div />);
  }
}

const LayoutComponent = withStyles(s)(Notification);
function mapStateToProps(state) {
  return {
    message: state.notification.message || '',
    time: state.notification.time || '',
  };
}

export default connectComponent({ LayoutComponent, mapStateToProps });
